<script>
import * as dictComp from '../mesDict'

export default {
  name: 'MesCellComp',
  components: dictComp,
  props: {
    column: {
      type: Object,
      default() {
        return {}
      }
    },
    colConfig: {
      type: Object,
      default() {
        return {}
      }
    },
    row: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  render(createElement) {
    // 返回的html
    let html
    // 组件名
    let tag = this.colConfig.hasOwnProperty('comp') ? this.colConfig.comp.charAt(0).toUpperCase() + this.colConfig.comp.slice(1) : ''
    // 子组件集合
    let componentList = dictComp || {}
    if (tag && componentList.hasOwnProperty(tag)) {
      // 使用组件，并且传入组件名存在
      let data = this.row
      if (tag === 'BoolType') {
        data = {label: this.row[this.colConfig.boolTypeLabel], value: this.row[this.colConfig.boolTypeValue]}
      }
      html = [
        createElement(tag, {
          props: {
            data: data,
            column: this.column
          }
        })
      ]
    } else if (this.colConfig.formatToDay) {
      // 日期格式化
      html = this.moment(this.row[this.column.prop]).format('YYYY-MM-DD')
    } else if (this.colConfig.formatToNumber) {
      // 默认0
      html = this.row[this.column.prop] || 0
    } else if (this.colConfig.jump) {
      // 点击按钮
      html = [
        createElement('span', {
          on: {
            click: (e) => {
              e.stopPropagation()
              this.$emit('jump')
            }
          },
          class: 'jump_item'
        }, this.row[this.column.prop])
      ]
    } else if (this.colConfig.vHtml) {
      console.log(this.row[this.column.prop])
      html = [
        createElement('span', {
          domProps: {
            innerHTML: this.row[this.column.prop]
          },
        })
      ]
    } else {
      html = this.row[this.column.prop]
    }
    return createElement('span', {
      class: 'mes_cell'
    }, html)
  }
}
</script>
